---
id: 5dc1798ff86c76b9248c6eb3
title: Passo 2
challengeType: 0
dashedName: step-2
---

# --description--

Os elementos de título, que vão de `h1` a `h6`, são usados para dar significado à importância do conteúdo abaixo deles. Quanto menor o número, maior a importância. Assim, os elementos `h2` têm menos importância que os elementos `h1`.

```html
<h1>most important heading element</h1>
<h2>second most important heading element</h2>
<h3>third most important heading element</h3>
<h4>fourth most important heading element</h4>
<h5>fifth most important heading element</h5>
<h6>least important heading element</h6>
```

Use apenas um elemento `h1` por página e coloque os títulos de importância inferior abaixo dos títulos de maior importância.

Abaixo do elemento `h1`, adicione um elemento `h2` com este texto:

`Cat Photos`

# --hints--

O elemento `h1` deve ter uma tag de abertura. As tags de abertura têm essa sintaxe: `<elementName>`.

```js
assert(document.querySelector('h1'));
```

O elemento `h1` deve ter uma tag de fechamento. As tags de fechamento têm um caractere `/` logo após o caractere `<`.

```js
assert(code.match(/<\/h1\>/));
```

Você deve ter apenas um elemento `h1`. Remova o elemento adicional.

```js
assert(
  document.querySelector('h1') && document.querySelectorAll('h1').length === 1
);
```

O elemento `h1` deve conter o texto 'CatPhotoApp'. Você omitiu o texto ou tem um erro de digitação.

```js
assert(document.querySelector('h1').innerText.toLowerCase() === 'catphotoapp');
```

O elemento `h2` deve ter uma tag de abertura. As tags de abertura têm essa sintaxe: `<elementName>`.

```js
assert(document.querySelector('h2'));
```

O elemento `h2` deve ter uma tag de fechamento. As tags de fechamento têm um caractere `/` logo após o caractere `<`.

```js
assert(code.match(/<\/h2\>/));
```

O elemento `h2` deve conter o texto 'Cat Photos'. Coloque apenas o texto `Cat Photos` entre as tags de abertura e de fechamento de `h2`.

```js
assert(document.querySelector('h2').innerText.toLowerCase() === 'cat photos');
```

O elemento `h2` deve estar abaixo do elemento `h1`. O elemento `h1` tem maior importância e deve estar acima do elemento `h2`.

```js
const collection = [...document.querySelectorAll('h1,h2')].map(
  (node) => node.nodeName
);
assert(collection.indexOf('H1') < collection.indexOf('H2'));
```

# --seed--

## --seed-contents--

```html
<html>
  <body>
--fcc-editable-region--
    <h1>CatPhotoApp</h1>

--fcc-editable-region--
  </body>
</html>
```

